<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <title>视频聊天</title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/webrtc-adapter/6.4.0/adapter.min.js" ></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js" ></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.blockUI/2.70/jquery.blockUI.min.js" ></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.2/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.1.0/bootbox.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/spin.js/2.3.2/spin.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.1.3/toastr.min.js"></script> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/cerulean/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="css/demo.css" type="text/css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.2/css/font-awesome.min.css" type="text/css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.1.3/toastr.css"/>
    <script src="./js/janus.js"></script>
    <script src="./js/videocalltest.js"></script>
</head>
<style type="text/css">
    .videos{
        max-width: 350px;
        height: 600px;
        display: block;
        position: relative;
        /*border: 1px solid #000000;*/
        margin-top:20px; 
    }
    .localVideo{
        max-width: 150px;
        
        height: auto;
        position: absolute;
        top:0;
        right: 0;
        z-index: 5;
    }
    .remotevideo{
        width:100%;
        display: block;
        height:auto;  
        position: absolute;
        z-index: -1;
    }
</style>
<body>
 
    <div class='videos'>
        <video id="myvideo" class="localVideo"  autoplay playsinline style=""></video>
        <video id="remotevideo" class="remotevideo" autoplay playsinline style=""></video>
    <div>

</body>

<script>

</script>
</html>